body{
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
/*font-family:"Helvetiva Neue","Helvetica","Arial","yahei",sans-serif;*/
}
img {
vertical-align: middle;
max-width: 100%;
height: auto;
}
/*---------------navbar----------------------*/
.navbar-logo{
/*width: 130px;*/
/*height: 50px;*/
/*height: 150px;*/
height: 200px;
margin-top: -35px;
/*margin-top: 5px;*/
/*margin-bottom: 10px;*/
}
@media (max-height: 480px){
.navbar-logo{
/*height: 100px;*/
height: 140px;
margin-top: -24px;
}
}
@media (max-width: 480px){
.navbar-logo{
height: 140px;
margin-top: -24px;
}
}
#brandid{
padding: 2px 15px;
}
#navbar{
background: none;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
/*padding-top: 10px;*/
/*padding-bottom: 10px;*/
margin-bottom: 0px;
left: 0;
/*position: fixed;*/
position:absolute;
top: 0;
width: 100%;
z-index: 1;
height: 62px;
/*height: 162px;*/
}
#navbar-toggle-id {
border-color: #666666;
}
/*.navbar-default .navbar-collapse{
z-index: 9999;
}*/
.navbar-default .navbar-collapse.in{
background-color: #fff;
opacity: 0.8;
/*background-color: #f8f8f8;*/
/*padding-left: 20px;*/
/*z-index: 20;*/
}
.navbar-default .navbar-collapse.in li a{
border-radius:0px;
border-bottom: 1px solid #666666;
/*padding-left: 50px;*/
/*text-align: right;*/
/*border-bottom: 1px solid #e5e5e5;*/
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #666666;
/* background-color: #FFFFFF;*/
}
.navbar-default .navbar-nav>li>a {
color: #000;
/*color: #ffffff;*/
border-radius: 5px;
text-align: center;
/*z-index: 22;*/
/*opacity: 0.8;*/
/*background-color: #000;*/
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
/*color: #fff;*/
/*color: #093856;*/
background-color: #fff;
}
.navbar-default .navbar-nav>li>a:hover {
/*color: #fff;*/
/*color: #2AA3B0;*/
color: #fff;
background-color: #666666;
/* background-color: #fff;*/
/*background: none;*/
/*opacity:0.6;*/
/*border: 1px solid #000;*/
opacity: 0.8;
}
.navbar-nav{
margin: 0px -15px;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
background-color: #fff;
}
.nav .open>a{
background-color: #337AB7;
}
/*#dropmenu-language{
padding: 0px;
min-width: 110px;
text-align: center;
}*/
/*.dropdown .open{
padding: 0px;
height: 135px;
z-index: 2
}
#dropmenu-language>li>a{
color: #093856;
color: #fff;
background-color: #5ec691;
}
#dropmenu-language>li>a:hover {
color: #fff;
color: #5ec691;
background-color: #093856;
background-color: #fff;
}*/
/*---------side-nav-----------*/
.side-nav{
position: fixed;
top: 45%;
right: 20px;
z-index: 1;
}
.side-nav ul.nav-side-nav{
text-align: center;
list-style: none;
margin:0px;
padding-left: 0px;
}
.side-nav ul.nav-side-nav >li{
display:block;
line-height:1.45em;
margin: 0px;
padding: 8px 0;
}
.side-nav ul.nav-side-nav >li>a{
display: block;
width: 10px;
height: 10px;
border-radius: 50%;
background: #e2e2e2;
}
/*---------------------section----------------*/
.section{
position: relative;
/*height: 100%;*/
/*padding:0px;*/
text-align: center;
}
.indexpage-bg{
/*position: relative;*/
width: 100%;
/*height: 100vmin;*/
height: 100vh;
/*background: url('../images/header-mobile.jpg') 50% 0 no-repeat;*/
/*background: url('../images/index1.jpg') 50% 0 no-repeat;*/
background: url('../images/index_mobile1.jpg') 50% 0 no-repeat;
background-size: 100% 100%;
overflow: hidden;
/*background: #164e78 50% 0 no-repeat;*/
/*background: url("../images/index1.jpg") 50% 0 no-repeat;*/
/* background: #51BFA5 50% 0 no-repeat;*/
/*padding: 0;*/
/* background-image: -webkit-linear-gradient(#51BFA5, #7ACEED);
background-image: -o-linear-gradient(#51BFA5, #7ACEED);
background-image: -moz-linear-gradient(#51BFA5, #7ACEED);
background-image: linear-gradient(#51BFA5, #7ACEED);*/
}
/*.section.indexpage-bg .outer {
width: 100vw;
height: 800px;
background: url('../images/header-mobile.jpg') 50% 0 no-repeat;
background: url('../images/index_mobile1.jpg') 50% 0 no-repeat;
background-size: auto 100%;
overflow: hidden;
}*/
@media (min-width: 992px){
.indexpage-bg {
background-image: url('../images/index1.jpg');
background-size: 100% 100%;
/*background-image: url('../images/header-base.png');*/
}
}
@media (max-width: 991px) and (orientation:portrait) {
.indexpage-bg {
/*background: url('../images/index_mobile1.jpg') 50% 0 no-repeat;*/
background-size: auto 100%;
/*background-image: url('../images/header-base.png');*/
}
}
.indexpage-bg .container{
/* padding-left: auto;
padding-right: auto;*/
/*position: relative;*/
text-align: center;
}
.indexpage-bg .jumo{
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
color: #fff;
/*position: absolute;*/
/*top: 40vh;*/
/*height: 100vh;*/
/*left:50*/
/*text-align: center;*/
/*margin: 0 auto;*/
/*width: 100%;*/
margin-left: auto;
margin-right: auto;
margin-top: 40vh;
/*margin: auto*/
}
.indexpage-bg .jumo h1{
font-size: 48px;
text-shadow: 3px 3px 10px #555555;
}
.indexpage-bg .jumo p{
font-size: 30px;
text-shadow: 3px 3px 10px #555555;
}
@media (max-width: 768px){
.indexpage-bg .jumo h1 {
font-size: 34px;
}
.indexpage-bg .jumo p{
font-size: 20px;
/*text-shadow: 3px 3px 10px #555555;*/
}
}
/*@keyframes groove {
from
{
transform:translate3d(0px, 0, 0);
-ms-transform:translate3d(0px, 0, 0);
}
to
{ -ms-transform:translate3d(40px, 0, 0); }
}
@-webkit-keyframes groove {
from
{ -webkit-transform:translate3d(0px, 0, 0); }
to
{ -webkit-transform:translate3d(40px, 0, 0); }
}
@-moz-keyframes groove {
from
{ -moz-transform:translate3d(0px, 0, 0); }
to
{ -moz-transform:translate3d(40px, 0, 0); }
}*/
/*
@keyframes huojianfei {
from
{
-webkit-transform:translate3d(0px, 0, 0);
transform:translate3d(0px, 0, 0);
}
to
{
-webkit-transform:translate3d(600px, -600px, 0);
transform:translate3d(600px, -600px, 0);
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
}
}*/
/*@-webkit-keyframes huojianfei {
}*/
/*@-moz-keyframes huojianfei {
}*/
/*.section.indexpage-bg .outer {
width: 100vw;
height: 800px;
background: url('../images/header-mobile.jpg') 50% 0 no-repeat;
background: url('../images/index_mobile1.jpg') 50% 0 no-repeat;
background-size: auto 100%;
overflow: hidden;
}
@media (min-width: 992px){
.section.indexpage-bg .outer {
background-image: url('../images/index1.jpg');
background-image: url('../images/header-base.png');
}
}*/
/*.section.indexpage-bg .outer #inn {
height: 100vmin;
margin: 0 auto;
}*/
/*
@media (min-width: 992px){
.section.indexpage-bg .outer #inn {
background: url('../images/header-overlay5.fw.png') 50% 0 no-repeat;
background: url('../images/index12.png') 50% 0 no-repeat;
background: url('../images/index4.png') 50% 0 no-repeat;
background-size: auto 100%;
margin: 0px;
height: 100vh;
-webkit-animation: groove 10s infinite alternate linear;
animation: groove 10s infinite alternate linear;
-moz-animation: groove 10s infinite alternate linear;
}
}*/
/*-------aboutus-----------*/
.aboutuspage-bg{
background: #eeeeee 50% 0 no-repeat;
/* background: #e1283d 50% 0 no-repeat;
padding: 0;
background-image: -webkit-linear-gradient(#e1283d, #ec0657);
background-image: -o-linear-gradient(#e1283d, #ec0657);
background-image: -moz-linear-gradient(#e1283d, #ec0657);
background-image: linear-gradient(#e1283d, #ec0657);*/
/*position: relative;*/
/*overflow: visible;*/
/*height: 100vh;*/
}
.aboutus-content {
/*padding-top: 40px;*/
padding-top: 6vh;
/*padding-bottom: 0px;*/
text-align: center;
}
/*@media (min-width: 992px){
.aboutus-content {
padding-top: 40px;
padding-bottom: 0px;
}}*/
.aboutuspage-bg h1{
/*font-size: 45px;*/
padding: 0;
color: #383934;
line-height: 8vh;
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
font-style: normal;
/*margin: 15px 0 15px 0;*/
margin: 0px;
text-shadow: 2px 2px 10px #e2e2e2;
/*font-size: 5vh;*/
font-size: 36px;
font-weight: 200;
}
@media (max-width: 768px){
.aboutuspage-bg h1{
font-size: 24px;
}
}
.aboutuspage-bg h2{
/*font-size: 45px;*/
padding: 0;
color: #848388;
line-height: 8vh;
/*font-family: "Hiragino Sans GB","Microsoft YaHei","Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","\9ED1\4F53";*/
/*font-style: normal;*/
font-family: Tahoma,Arial,Roboto,"Droid Sans","Helvetica Neue","Droid Sans Fallback","Heiti SC","Hiragino Sans GB","Hiragino Sans GB","Microsoft YaHei",Simsun,sans-self;
/*margin: 15px 0 15px 0;*/
margin: 0px;
/*text-shadow: 2px 2px 10px #e2e2e2;*/
/*font-size: 5vh;*/
font-size: 30px;
font-weight: 100;
}
@media (max-width: 768px){
.aboutuspage-bg h2{
font-size: 20px;
}
}
/*@media (max-width: 480px){
.aboutuspage-bg h1 {
font-size: 5vw;
}}
@media (min-width: 481px){
.aboutuspage-bg h1 {
font-size: 5vw;
}}
@media (min-width: 992px){
.aboutuspage-bg h1 {
font-size: 3.5vw;
}}*/
.aboutuspage-bg p.sub-heading {
color: #383934;
/*font-size: 3vh;*/
font-size: 40px;
line-height: 6vh;
margin: 0px;
/*font-style: italic;*/
text-shadow: 2px 2px 10px #e2e2e2;
}
@media (max-width: 768px){
.aboutuspage-bg p.sub-heading {
font-size: 28px;
}
}
.aboutuspage-bg p.sub-heading2 {
color: #848388;
/*font-size: 3vh;*/
font-size: 20px;
line-height: 6vh;
margin: 0px;
/*font-style: italic;*/
text-shadow: 2px 2px 10px #e2e2e2;
font-weight: lighter;
}
@media (max-width: 768px){
.aboutuspage-bg p.sub-heading2 {
font-size: 16px;
}
}
.redblock{
display: block;
margin-left: auto;
margin-right: auto;
width: 10vw;
height: 0.5vh;
background-color: #f83650;
border: 0px;
margin-top: 0vh;
margin-bottom: 0vh;
}
/*.aboutuspage-bg p.sub-heading2 {
line-height: 4vh;
}*/
/*.aboutuspage-bg p.sub-heading.light {
opacity: 0.8;
}*/
/*@media (max-width: 480px){
.aboutuspage-bg p.sub-heading {
font-size: 16px;
}}
@media (min-width: 481px){
.aboutuspage-bg p.sub-heading {
font-size: 20px;
}}
@media (min-width: 992px){
.aboutuspage-bg p.sub-heading {
font-size: 25px;
}}*/
.aboutuspage-bg .btn1{
/*display: inline;*/
position: relative;
margin-top: 7vh;
/*margin-bottom: 0px;*/
margin-left: auto;
margin-right: auto;
/*width: auto;*/
/*padding: 0px;*/
text-align: center;
width: 53vh;
/*text-align: center center;*/
/*overflow: hidden;*/
}
.aboutuspage-bg .btn1 .qq{
/*margin: 0 auto;*/
position: relative;
width: 8vh;
height: 9.6vh;
background: url('../images/QQ.png') 0 0 no-repeat;
/*background: url('../images/index4.png') 50% 0 no-repeat;*/
background-size: 100% auto;
float: left;
}
@keyframes btnjump {
from
{ }
to
{
transform:scale(1.1,1.1);
-ms-transform:scale(1.1,1.1); /* IE 9 */
}
}
@-webkit-keyframes btnjump {
from
{ }
to
{
-webkit-transform:scale(1.1,1.1); /* Safari and Chrome */
}
}
@-moz-keyframes btnjump {
from
{ }
to
{
-moz-transform:scale(1.1,1.1); /* Firefox */
}
}
.aboutuspage-bg .btn1 a{
text-align: center;
color: #fff;
width: 8vh;
height: 1.6vh;
/*background: url('../images/QQ.png') 0 0 no-repeat;*/
/*background: url('../images/index4.png') 50% 0 no-repeat;*/
/*background-size: 100% auto;*/
position: absolute;
padding-top: 8vh;
display: block;
text-decoration: none;
line-height: 1.6vh;
font-size: 1.2vh;
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
font-style: normal;
}
.aboutuspage-bg .btn1 .wangwang{
position: relative;
margin-left: 7vh;
width: 8vh;
height: 9.6vh;
background: url('../images/wangwang.png') 0 0 no-repeat;
/*background: url('../images/index4.png') 50% 0 no-repeat;*/
background-size: 100% auto;
float: left;
}
.aboutuspage-bg .btn1 .weixin2{
position: relative;
width: 8vh;
height: 9.6vh;
margin-left: 7vh;
background: url('../images/weixin.png') 0 0 no-repeat;
/*background: url('../images/index4.png') 50% 0 no-repeat;*/
background-size: 100% auto;
float: left;
}
.aboutuspage-bg .btn1 .phone{
position: relative;
width: 8vh;
height: 9.6vh;
margin-left: 7vh;
background: url('../images/phone.png') 0 0 no-repeat;
/*background: url('../images/index4.png') 50% 0 no-repeat;*/
background-size: 100% auto;
float: left;
}
/*.aboutuspage-bg .btn1 .qq:hover{*/
.aboutuspage-bg .btn1 .qq:hover{
-webkit-animation: btnjump 0.3s infinite alternate ease-in-out;
animation: btnjump 0.3s infinite alternate ease-in-out;
-moz-animation: btnjump 0.3s infinite alternate ease-in-out;
}
.aboutuspage-bg .btn1 .wangwang:hover{
-webkit-animation: btnjump 0.3s infinite alternate ease-in-out;
animation: btnjump 0.3s infinite alternate ease-in-out;
-moz-animation: btnjump 0.3s infinite alternate ease-in-out;
}
.aboutuspage-bg .btn1 .weixin2:hover{
-webkit-animation: btnjump 0.3s infinite alternate ease-in-out;
animation: btnjump 0.3s infinite alternate ease-in-out;
-moz-animation: btnjump 0.3s infinite alternate ease-in-out;
}
.aboutuspage-bg .btn1 .phone:hover{
-webkit-animation: btnjump 0.3s infinite alternate ease-in-out;
animation: btnjump 0.3s infinite alternate ease-in-out;
-moz-animation: btnjump 0.3s infinite alternate ease-in-out;
}
.aboutuspage-bg .absolute-image {
width: 100%;
position: absolute;
left: 0;
bottom: -7.4vh;
z-index: 2;
}
.aboutuspage-bg .absolute-image img {
/*height: 30vh;*/
width: 100%;
/*position: absolute;*/
/*left: 0;*/
/*bottom: -7.6vh;*/
}
@media (min-width: 768px){
.aboutuspage-bg .absolute-image {
/*bottom: -15vh;*/
}}
/*@media (min-width: 992px){
.aboutuspage-bg .absolute-image {
bottom: -88px;
}}*/
.aboutuspage-bg .container {
position: relative;
}
/*-----servicepage------*/
.servicepage-bg{
background: #ffffff 50% 0 no-repeat;
/*width: 100%;*/
/*height: 100vh;*/
/* padding: 0;
background-image: -webkit-linear-gradient(#47b97d, #ffffff);
background-image: -o-linear-gradient(#47b97d, #ffffff);
background-image: -moz-linear-gradient(#47b97d, #ffffff);
background-image: linear-gradient(#47b97d, #ffffff);*/
}
.servicepage-bg .container{
margin-top: 10vh;
/*width: 100%;*/
}
/*@media (min-width: 768px){
.servicepage-bg .container{
height: 100vh;
height: auto;
}}*/
.servicepage-bg .container h2{
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
color: #999;
text-align: center;
margin-bottom: 0;
margin-top: 60px;
}
.content-block {
margin-bottom: 60px;
margin-top: 50px;
overflow: hidden;
text-align: center;
float: left;
/*width: 33%;*/
}
#servicepage .icon.a:hover {
background-color: #fff;
}
#servicepage .icon.b:hover {
background-color: #72b19c;
}
#servicepage .icon.c:hover {
background-color: #344d5b;
}
#servicepage .icon.d:hover {
background-color: #ef747f;
}
#servicepage .icon.e:hover {
background-color: #6278ba;
}
#servicepage .icon.f:hover {
background-color: #52bbe7;
}
.icon {
position: relative;
overflow: hidden;
width: 128px;
height: 128px;
background-color: #eee;
-webkit-border-radius: 128px;
border-radius: 128px;
background: #eef0f0;
margin: auto;
-webkit-transition: background 0.3s ease-out;
-moz-transition: background 0.3s ease-out;
-o-transition: background 0.3s ease-out;
-ms-transition: background 0.3s ease-out;
transition: background 0.3s ease-out;
}
@media (max-width: 768px){
.icon {
-webkit-transform: scale(0.75);
-moz-transform: scale(0.75);
-o-transform: scale(0.75);
-ms-transform: scale(0.75);
transform: scale(0.75);
}
}
.content-block .content-text {
/*width: 292px;*/
margin: auto;
}
.servicepage-bg .container h3 {
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
/*color: #1a8fb4;*/
color: #000;
font-weight: 300;
}
/*@media (max-width: 768px){
.servicepage-bg .container h2{
width: 80vw;
}
}*/
.servicepage-bg .container p {
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
color: #555;
/*margin-bottom: 2em;*/
font-weight: 300;
font-size: 14px;
line-height: 16px;;
}
.servicepage-bg .iconposition{
position: absolute;
/* width: 100%;
height: 100%;*/
}
.servicepage-bg #round1{
position:absolute;
overflow: hidden;
width: 64px;
height: 64px;
left:26px;
top:26px;
background-color: #53bbe6;
-webkit-border-radius: 64px;
border-radius: 64px;
background: #53bbe6;
opacity: 0.9;
z-index: 1;
/*margin: auto;*/
}
.servicepage-bg #round2{
position:absolute;
z-index: 2;
overflow: hidden;
width: 45px;
height: 45px;
left:66px;
top:66px;
background-color: #ef747f;
-webkit-border-radius: 64px;
border-radius: 64px;
background: #ef747f;
opacity: 0.9;
/*margin: auto;*/
}
.servicepage-bg #round3{
position:absolute;
z-index: 3;
overflow: hidden;
width: 42px;
height: 42px;
left:70px;
top:35px;
background-color: #e8d05b;
-webkit-border-radius: 42px;
border-radius: 42px;
background: #e8d05b;
opacity: 0.9;
/*margin: auto;*/
}
.servicepage-bg #round4{
position:absolute;
z-index: 4;
overflow: hidden;
width: 30px;
height: 30px;
left:40px;
top:80px;
background-color: #6278ba;
-webkit-border-radius: 30px;
border-radius: 30px;
background: #6278ba;
opacity: 0.9;
/*margin: auto;*/
}
@keyframes roundin {
from
{ transform:scale(0.9,0.9);
-ms-transform:scale(0.9,0.9);
}
to
{
transform:scale(1,1);
-ms-transform:scale(1,1);
}
}
@-webkit-keyframes roundin {
from
{ -webkit-transform:scale(0.9,0.9); }
to
{
-webkit-transform:scale(1,1); /* Safari and Chrome */
}
}
@-moz-keyframes roundin {
from
{ -moz-transform:scale(0.9,0.9); }
to
{
-moz-transform:scale(1,1); /* Safari and Chrome */
}
}
.servicepage-bg #leptop_under{
position:absolute;
z-index: 4;
/*overflow: hidden;*/
width: 115px;
height: 6px;
left:6px;
top:89px;
background: url("../images/serviceimg2.png") no-repeat -5px -570px ;
}
.servicepage-bg #leptop_front{
position:absolute;
z-index: 3;
/*overflow: hidden;*/
width: 92px;
height: 66px;
left:18px;
top:24px;
background: url("../images/serviceimg2.png") no-repeat -14px -471px ;
}
/*@-webkit-keyframes leptopin {
0% {-webkit-transform: rotateX(0deg) translate3d(0,0,0); }
50%{ -webkit-transform: rotateX(-45deg) translate3d(0,9px,0);}
51%{ background:none;}
52%{ background: url("../images/serviceimg3.png") 50% 0 no-repeat ;}
99% { -webkit-transform: rotateX(-45deg) ; }
100% {background: url("../images/serviceimg2.png") no-repeat -122px -472px ;left:6px;top:83px; width: 115px;height: 4px;
}
from
{ -webkit-transform: rotateX(0deg) translate3d(0,0,0);}
to
{
-webkit-transform: rotateX(-45deg) translate3d(0,9px,0);
}
}*/
.servicepage-bg #handy{
position: absolute;
z-index: 2;
/*text-align: center;*/
left:-4px;
top:-9px;
width: 49px;
height: 92px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -41px -48px ;
/*background-size:300%;*/
/*overflow: hidden;*/
}
.servicepage-bg #handyin{
/*text-align: center;*/
left:43px;
top:25px;
width: 40px;
height: 69px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -104px -57px ;
/*background-size:300%;*/
/*overflow: hidden;*/
}
@keyframes handyout {
from
{ background: url("../images/serviceimg2.png") no-repeat -104px -57px ; }
to
{
background: url("../images/serviceimg2.png") no-repeat -144px -57px ;
}
}
@-webkit-keyframes handyout {
from
{ background: url("../images/serviceimg2.png") no-repeat -104px -57px ; }
to
{
background: url("../images/serviceimg2.png") no-repeat -144px -57px ;
}
}
@-moz-keyframes handyout {
from
{ background: url("../images/serviceimg2.png") no-repeat -104px -57px ; }
to
{
background: url("../images/serviceimg2.png") no-repeat -144px -57px ;
}
}
.servicepage-bg #weixin{
/*text-align: center;*/
left:20px;
top:25px;
width: 93px;
height: 77px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -41px -335px ;
/*background-size:300%;*/
/*overflow: hidden;*/
}
.servicepage-bg #eye1{
/*text-align: center;*/
z-index: 2;
left:37px;
top:40px;
width: 62px;
height: 31px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -140px -345px ;
/*background-size:300%;*/
/*overflow: hidden;*/
}
@keyframes eye1 {
0% {left:34px; }
20% {left:42px; }
60%{ left:37px; opacity: 0.8; }
80%{ left:37px; }
100% { left:32px; }
}
@-webkit-keyframes eye1 {
0% {left:34px; }
20% {left:42px; }
60%{ left:37px; opacity: 0.8; }
80%{ left:37px; }
100% { left:32px; }
}
@-moz-keyframes eye1 {
0% {left:34px; }
20% {left:42px; }
60%{ left:37px; opacity: 0.8; }
80%{ left:37px; }
100% { left:32px; }
}
/*.servicepage-bg #eye2{
text-align: center;
left:20px;
top:25px;
width: 93px;
height: 77px;
background-attachment:fixed;
background: url("../images/serviceimg2.png") no-repeat -41px -335px ;
background-size:300%;
overflow: hidden;
}*/
.servicepage-bg #gear1{
/*text-align: center;*/
left:24px;
top:56px;
width: 50px;
height: 50px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -41px -192px ;
/*background-size:300%;*/
/*overflow: hidden;*/
-webkit-animation: gear1 5s infinite forwards linear;
animation: gear1 5s infinite forwards linear;
-moz-animation: gear1 5s infinite forwards linear;
}
.servicepage-bg #gear2{
/*text-align: center;*/
left:65px;
top:28px;
width: 50px;
height: 50px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -41px -192px ;
/*background-size:300%;*/
/*overflow: hidden;*/
-webkit-animation: gear2 5s infinite forwards linear;
animation: gear2 5s infinite forwards linear;
-moz-animation: gear2 5s infinite forwards linear;
}
@keyframes gear1 {
from
{ transform:rotate(0deg); }
{ -ms-transform:rotate(0deg); }
to
{
transform:rotate(360deg);
-ms-transform:rotate(360deg);
}
}
@-webkit-keyframes gear1 {
from
{ -webkit-transform:rotate(0deg); }
to
{
-webkit-transform:rotate(360deg);
}
}
@-moz-keyframes gear1 {
from
{ -moz-transform:rotate(0deg); }
to
{
-moz-transform:rotate(360deg);
}
}
@keyframes gear2 {
from
{ transform:rotate(0deg); }
{ -ms-transform:rotate(0deg); }
to
{
transform:rotate(-360deg);
-ms-transform:rotate(-360deg);
}
}
@-webkit-keyframes gear2 {
from
{ -webkit-transform:rotate(0deg); }
to
{
-webkit-transform:rotate(-360deg);
}
}
@-moz-keyframes gear2 {
from
{ -moz-transform:rotate(0deg); }
to
{
-moz-transform:rotate(-360deg);
}
}
.servicepage-bg #rocket{
/*text-align: center;*/
left:31px;
top:18px;
width: 65px;
height: 70px;
/*background-attachment:fixed;*/
background: url("../images/serviceimg2.png") no-repeat -113px -192px ;
/*background-size:300%;*/
/*overflow: hidden;*/
}
@keyframes rocketjump {
from
{ transform:translate3d(0, 0px, 0); }
{ -ms-transform:translate3d(0, 0px, 0); }
to
{
transform:translate3d(0, 5px, 0);
-ms-transform:translate3d(0, 5px, 0);
}
}
@-webkit-keyframes rocketjump {
from
{ -webkit-transform:translate3d(0, 0px, 0); }
to
{
-webkit-transform:translate3d(0, 5px, 0);
}
}
@-moz-keyframes rocketjump {
from
{ -moz-transform:translate3d(0, 0px, 0); }
to
{
-moz-transform:translate3d(0, 5px, 0);
}
}
.servicepage-bg #fire{
left:54px;
top:90px;
width: 19px;
height: 20px;
background: url("../images/serviceimg2.png") no-repeat -121px -274px ;
}
.servicepage-bg .star #star1{
position: absolute;
left:28px;
top:50px;
width: 12px;
height: 12px;
background: url("../images/serviceimg2.png") no-repeat -148px -273px ;
}
.servicepage-bg .star #star2{
position: absolute;
left:84px;
top:28px;
width: 12px;
height: 12px;
background: url("../images/serviceimg2.png") no-repeat -148px -273px ;
}
.servicepage-bg .star #star3{
position: absolute;
left:100px;
top:62px;
width: 12px;
height: 12px;
background: url("../images/serviceimg2.png") no-repeat -148px -273px ;
}
@keyframes starrun {
0% {top:0px; opacity: 0; }
10% {top:10px; opacity: 1; }
100% {top:100px; opacity: 0.2; }
}
@keyframes starrun2 {
0% {top:0px; opacity: 0; }
30% {top:0px; opacity: 0; }
40% {top:20px; opacity: 1; }
100% {top:80px; opacity: 0.2; }
}
@keyframes starrun3 {
0% {top:62px; opacity: 0; }
20% {top:62px; opacity: 0; }
40% {top:75px; opacity: 1; }
100% {top:120px; opacity: 0; }
}
@-webkit-keyframes starrun {
0% {top:0px; opacity: 0; }
10% {top:10px; opacity: 1; }
100% {top:100px; opacity: 0.2; }
}
@-webkit-keyframes starrun2 {
0% {top:0px; opacity: 0; }
30% {top:0px; opacity: 0; }
40% {top:20px; opacity: 1; }
100% {top:80px; opacity: 0.2; }
}
@-webkit-keyframes starrun3 {
0% {top:62px; opacity: 0; }
20% {top:62px; opacity: 0; }
40% {top:75px; opacity: 1; }
100% {top:120px; opacity: 0; }
}
@-moz-keyframes starrun {
0% {top:0px; opacity: 0; }
10% {top:10px; opacity: 1; }
100% {top:100px; opacity: 0.2; }
}
@-moz-keyframes starrun2 {
0% {top:0px; opacity: 0; }
30% {top:0px; opacity: 0; }
40% {top:20px; opacity: 1; }
100% {top:80px; opacity: 0.2; }
}
@-moz-keyframes starrun3 {
0% {top:62px; opacity: 0; }
20% {top:62px; opacity: 0; }
40% {top:75px; opacity: 1; }
100% {top:120px; opacity: 0; }
}
/*--------casepage---------*/
.casepage-bg{
background: #666666 50% 0 no-repeat;
padding: 0;
}
.casepage-bg .container-fluid{
padding: 0px;
}
.casepage-bg .friendslogo{
background-color: #434343;
/*color:*/
padding-bottom: 120px;
padding-top: 120px;
}
/*.casepage-bg .friendslogo .friendslogobigger:hover{
-webkit-animation: imagebigger 0.3s forwards;
animation: imagebigger 0.3s forwards;
-moz-animation: imagebigger 0.3s forwards;
}*/
@media (max-width: 991px) and (min-width: 768px){
.casepage-bg .container{
padding-left: 12%;
padding-right: 12%;
}
}
@media (max-width: 767px){
.casepage-bg .container {
padding-left: 33px;
padding-right: 33px;
}
}
@media (max-width: 991px){
.casepage-bg .friendslogo {
padding-bottom: 33px;
padding-top: 66px;
}
}
.casepage-bg #case1,.casepage-bg #case2,.casepage-bg #case3,.casepage-bg #case4,.casepage-bg #case5,.casepage-bg #case6{
padding: 0px;
overflow: hidden;
}
.casepage-bg .container-fluid .case-sild{
position: relative;
}
.casepage-bg .container-fluid .case-sild .eclipse {
color: #fff;
width: 40vw;
height: 40vw;
opacity: 0.9;
position:absolute;
transform:translate(-55vw,-70vw) rotate(-45deg);
-webkit-transform:translate(-55vw,-70vw) rotate(-45deg);
-moz-transform:translate(-55vw,-70vw) rotate(-45deg);
}
.casepage-bg .container-fluid .case-sild .text_bg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.casepage-bg .container-fluid .case-sild .hover-in{
opacity: 0;
color: #fff;
z-index: 1;
font-family: "Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53";
/*font-size: 18px;*/
}
.casepage-bg .handy-case{
height: 40px;
background-color: #434343;
/*background-color: #252525;*/
/*background-color: #5ec691;*/
}
.casepage-bg .handy-case a{
display: block;
color: #e1e1df;
text-decoration: none;
font-size: 12px;
line-height: 40px;
text-align: center;
}
@keyframes hoverin {
from
{ opacity: 0;
filter:Alpha(opacity=0);
transform: translate(0vw,0vw);
-ms-transform: translate(0vw,0vw);
}
to
{
opacity: 1;
filter:Alpha(opacity=100);
transform: translate(0vw,6vw);
-ms-transform: translate(0vw,6vw);
}
}
@-webkit-keyframes hoverin {
from
{
opacity: 0;
-webkit-transform: translate(0vw,0vw);
}
to
{
opacity: 1;
-webkit-transform: translate(0vw,6vw);
}
}
@-moz-keyframes hoverin {
from
{
opacity: 0;
-moz-transform: translate(0vw,0vw);
}
to
{
opacity: 1;
-moz-transform: translate(0vw,6vw);
}
}
@keyframes hoverout {
from
{
opacity: 1;
filter:Alpha(opacity=100);
transform: translate(0vw,6vw);
-ms-transform: translate(0vw,6vw);
}
to
{
opacity: 0;
filter:Alpha(opacity=0);
transform: translate(0vw,0vw);
-ms-transform: translate(0vw,0vw);
}
}
@-webkit-keyframes hoverout {
from
{
opacity: 1;
-webkit-transform: translate(0vw,6vw);
}
to
{
opacity: 0;
-webkit-transform: translate(0vw,0vw);
}
}
@-moz-keyframes hoverout {
from
{
opacity: 1;
-moz-transform: translate(0vw,6vw);
}
to
{
opacity: 0;
-moz-transform: translate(0vw,0vw);
}
}
.casepage-bg .container-fluid .case-sild .text-indent-hide{
overflow: hidden;
text-indent: -9999px;
z-index: 2;
/*background-color: #555555;*/
/*top: -100%;*/
/*left: 0;*/
}
@-webkit-keyframes textin {
from
{
top: -100%;
}
to
{
top: 0;
}
}
@-webkit-keyframes textout {
from
{
top: 0;
}
to
{
top: -100%;
}
}
@keyframes imagebigger {
from
{ }
to
{
transform:scale(1.2,1.2);
-ms-transform:scale(1.2,1.2); /* IE 9 */
}
}
@-webkit-keyframes imagebigger {
from
{ }
to
{
-webkit-transform:scale(1.2,1.2); /* Safari and Chrome */
}
}
@-moz-keyframes imagebigger {
from
{ }
to
{
-moz-transform:scale(1.2,1.2); /* Firefox */
}
}
@keyframes imagesmaller {
from
{ transform:scale(1.2,1.2);
-ms-transform:scale(1.2,1.2); /* IE 9 */ }
to
{
transform:scale(1,1);
-ms-transform:scale(1,1); /* IE 9 */
}
}
@-webkit-keyframes imagesmaller {
from
{
-webkit-transform:scale(1.2,1.2); /* Safari and Chrome */ }
to
{
-webkit-transform:scale(1,1); /* Safari and Chrome */
}
}
@-moz-keyframes imagesmaller {
from
{
-moz-transform:scale(1.2,1.2); /* Firefox */ }
to
{
-moz-transform:scale(1,1); /* Firefox */
}
}
@keyframes casebgin {
from
{
transform:translate(-55vw,-70vw) rotate(-45deg);
-ms-transform:translate(-55vw,-70vw) rotate(-45deg);
}
to
{
transform:translate(-2vw,-30vw) rotate(-45deg);
-ms-transform:translate(-2vw,-30vw) rotate(-45deg);
}
}
@-webkit-keyframes casebgin {
from
{
-webkit-transform:translate(-55vw,-70vw) rotate(-45deg);
}
to
{
-webkit-transform:translate(-2vw,-30vw) rotate(-45deg);
}
}
@-moz-keyframes casebgin {
from
{
-moz-transform:translate(-55vw,-70vw) rotate(-45deg);
}
to
{
-moz-transform:translate(-2vw,-30vw) rotate(-45deg);
}
}
@keyframes casebgout {
from
{ transform:translate(-2vw,-30vw) rotate(-45deg);
-ms-transform:translate(-2vw,-30vw) rotate(-45deg);
}
to
{
transform:translate(-55vw,-70vw) rotate(-45deg);
-ms-transform:translate(-55vw,-70vw) rotate(-45deg);
}
}
@-webkit-keyframes casebgout {
from
{
-webkit-transform:translate(-2vw,-30vw) rotate(-45deg);
}
to
{
-webkit-transform:translate(-55vw,-70vw) rotate(-45deg);
}
}
@-moz-keyframes casebgout {
from
{
-moz-transform:translate(-2vw,-30vw) rotate(-45deg);}
to
{
-moz-transform:translate(-55vw,-70vw) rotate(-45deg);
}
}
/*requirepage-bg*/
.requirepage-bg{
background: #ffffff 50% 0 no-repeat;
padding: 0;
background-image: -webkit-linear-gradient(#4da1d8, #6dbfd2);
background-image: -o-linear-gradient(#4da1d8, #6dbfd2);
background-image: -moz-linear-gradient(#4da1d8, #6dbfd2);
background-image: linear-gradient(#4da1d8, #6dbfd2);
}
.blog-footer {
padding: 60px 0;
font-size: 13px;
text-align: center;
/*background-color: #f9f9f9;*/
background-color: #252525;
/*border-top: 1px solid #e5e5e5;*/
}
.blog-footer a{
color: #fff;
text-decoration: none;
}
.blog-footer .footer-text{
color: #5f5e5d;
text-decoration: none;
}
.blog-footer .footer-text a{
color: #5f5e5d;
text-decoration: none;
}
.blog-footer .footer-text a:hover{
color: #eeeeee;
/*text-decoration: none;*/
}